<template>
    <div id="news-list">
        <ul class="mui-table-view">
            <li class="mui-table-view-cell mui-media" v-for="(item, index) in datalist" :key="index">
                <router-link :to="'/Home/newsList/' + item.id">
                    <img class="mui-media-object mui-pull-left" :src="item.img_url">
                    <div class="mui-media-body">
                        <h1>{{item.title | substr}}</h1>
                        <p class='mui-ellipsis'>
                            <span>发表时间:{{item.add_time | dateFormat}}</span>
                            <span>点击{{item.click}}次</span>
                        </p>
                        
                    </div>
                </router-link>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
    name:'news-list',
    data(){
        return{
            datalist:[],
            strsss:'111'
        }
    },
    created() {
        this.getNewsList()
    },
    methods:{
        getNewsList(){
            this.$axios.get('getnewslist').then(data=>{
                //console.log(data.data)
                this.datalist=data.data.message;
            })
        }
    }
}
</script>

<style scoped>
.mui-table-view li h1{
    font-size: 14px;
}
.mui-table-view li .mui-ellipsis{
    font-size: 12px;
    color: rgb(100, 121, 212);
    display: flex;
    justify-content: space-between;
}
</style>


